<%@page import="java.util.HashMap"%>
<%@ page language="java" contentType="text/html"  pageEncoding="UTF-8" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib prefix="lcfms" uri="/WEB-INF/tld/lcfms.tld" %>	
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<link rel="stylesheet" href="${CSS}bootstrap.min.css"/>
	<link rel="stylesheet" href="${CSS}iconfont.css"/>	
	<link rel="stylesheet" href="${CSS}b.page.bootstrap3.css" type="text/css">
	<link rel="stylesheet" href="${CSS}form.css">
	<link rel="stylesheet" href="${CSS}kalendae.css"/>
	<script src="${JS}jquery-3.2.1.min.js" type="text/javascript"></script>
	<script src="${JS}../../layer/layer.js"></script>
	<script src="${JS}bootstrap.min.js"></script>
	<script src="${JS}b.page.js" type="text/javascript"></script>
	<script src="${JS}form.js"></script>
	<script src="${JS}kalendae.js"></script>	
	<style>
	.editText>a{margin-right:10px;}
	</style>
</head>
<body>
<div class="container-fluid">
	<div class="row">
	    <div style="padding:10px;">
	    <c:if test="${filter.size()>0}">
		<form class="form-horizontal" name="myform" method="get" action="${APP}${pageurlpath}">
		<div class="form-body">
			<c:forEach var="i" begin="0" end="${filter.size()}">
			<c:forEach var="valm" items="${filter}">
			<c:if test="${valm.sort==i}">
			<lcfms:if test="${valm.form eq 'hidden'}">
				<input class="form-control input-sm" name="${valm.name}" type="hidden" value="${valm.value}">
			</lcfms:if>
			<lcfms:else>
		    <div class="col-sm-4">
			<div class="form-group">
				<c:if test="${null!=valm.title && '' ne valm.title}">
				<label class="col-sm-4 control-label">
					${valm.title}：
				</label>
				</c:if>
				<div class="col-sm-8">
					<c:if test="${valm.form eq 'input'}">
						<input class="form-control input-sm" name="${valm.name}" type="text" value="${valm.value}">
					</c:if>
					<c:if test="${valm.form eq 'select'}">
					<select class="form-control" name="${valm.name}">
					    <c:set var="i" value="0"/>	
						<c:forEach items="${valm.values}" var="formitem">																		
						<option value="${formitem}" <c:if test="${valm.value eq formitem}">selected</c:if>>
						<c:out value="${valm.text[i]}"/>								
						</option>
						<c:set var="i" value="${i+1}"/>	
						</c:forEach>											
					</select>					
					</c:if>			
					<c:if test="${valm.form eq 'time'}">
						<input readonly="readonly" class="form-control calendar" value="${valm.value}" name="${valm.name}" type="text" months="1" mode="single" direction="">      					
					</c:if>			
				</div>
			</div>
			</div>
			</lcfms:else>
			</c:if>
			</c:forEach>
			</c:forEach>
		    <div class="col-sm-4">
			    <div class="form-group">
			    <div class="col-sm-8"><button type="button" id="save" class="btn btn-sm btn-grey"><i class="iconfont icon-soushuo"></i> 搜索</button></div>								
			    </div>
			</div>	
		</div>												
		</form>	
		<script>
		var myform=form.init("myform");	
		$("#save").click(function(){
			myform.submit();
		});
		</script>
		</c:if>
		<lcfms:if test="${datalist.size()==0}">
			<div style="text-align:center;font-size:22px;clear:both;">无数据</div>
		</lcfms:if>
		<lcfms:else>
		<table id="tableBox" class="bTable table table-striped table-bordered table-hover table-condensed">
			<thead>
				<tr>
					<c:forEach items="${column}" var="col">		
					    <c:if test="${columnWidth.get(col)!=0}">
						<lcfms:if test="${sortColumn.contains(col)}">
						    <c:if test="${col.concat('_asc') eq sort}">
							<th width="${columnWidth.get(col)}px"><label class="sortColumn" column="${col}" sort="asc"><i class="iconfont icon-paixushang"></i>&nbsp;${col}</label></th>
						    </c:if>
						    <c:if test="${col.concat('_desc') eq sort}">
							<th width="${columnWidth.get(col)}px"><label class="sortColumn" column="${col}" sort="desc"><i class="iconfont icon-sortdown"></i>&nbsp;${col}</label></th>
						    </c:if>
						    <c:if test="${col.concat('_asc') ne sort && col.concat('_desc') ne sort}">
							<th width="${columnWidth.get(col)}px"><label class="sortColumn" column="${col}" sort=""><i class="iconfont icon-paixu"></i>&nbsp;${col}</label></th>
						    </c:if>										
						</lcfms:if>
						<lcfms:else>
						<th width="${columnWidth.get(col)}px">${col}</th>
						</lcfms:else>	
						</c:if>														
					</c:forEach>
				</tr>
			</thead>
			<tbody>
			<c:forEach items="${datalist}" var="val">
				<tr>							    
				    <c:forEach items="${column}" var="col1">
				    <c:if test="${columnWidth.get(col1)!=0}">
					<td>${val.get(col1)}</td>
					</c:if>
					</c:forEach>				
				</tr>
			 </c:forEach>							
			</tbody>
		</table>
		</lcfms:else>					
		<div style="position:absolute;bottom:0px;" id="page" pagenumber="${pagenumber}" pagesize="${pagesize}" totalrow="${totalrow}"></div>
		</div>
	</div>
</div>
<script>
$(function(){
	//设置分页
	var pageNumber=$('#page').attr("pageNumber");
	var pageSize=$('#page').attr("pageSize");
	var totalRow=$('#page').attr("totalRow");
	var totalPage=Math.ceil(totalRow/pageSize);
	$('#page').bPage({  
	    url : '${APP}${pageurlpath}${pageurlquery}',
	    totalPage :totalPage,
	    totalRow :totalRow,
	    pageSize :pageSize,
	    pageNumber:pageNumber,
	    pageSizeMenu:[pageSize,pageSize*2,pageSize*4,pageSize*8]
	});	
	//设置排序
	$(".sortColumn").click(function(){
		var column=$(this).attr("column");
		var sort=$(this).attr("sort");
		if(sort==""){
			location.href="${APP}${pageurlpath}?sort_asc="+column;
		}
		if(sort=="asc"){
			location.href="${APP}${pageurlpath}?sort_desc="+column;
		}
		if(sort=="desc"){
			location.href="${APP}${pageurlpath}?sort_asc="+column;
		}
	});
	//图片变大
	$("#tableBox img").click(function(){
		var json={pid:$(this).attr("pid"),alt:$(this).attr("alt"),src:$(this).attr("original"),thumb:$(this).attr("src")};		
		layer.photos({
		    photos: {
	    	  "title": "查看图片", 
	    	  "id": 1,
	    	  "start": 0, 
	    	  "data":[json]
		   	}
		});
	});	
});

function openNewTab(itemId,url,itemName){
	if(url.indexOf("http")==-1){
		var c="${USERINFO.mca[1]}".toLowerCase();
		url="${APP}${USERINFO.mca[0]}/"+c+"/"+url;
	}
	parent.openNewTab(itemId,url,itemName)	
}

function openlayer(title,icon,url,width,height){
	if(width==0 && height==0){
		layer.confirm('您确定要'+title+'吗？',{btn: ['是的','取消']}, function(){
			$.get(url,function(res){
				layer.msg(res.msg);
				if(res.code==1 && res.url){
					setTimeout(function(){
						location.href=res.url;
					},1000)
				}
			},'json');
		});
	}else{
		layer.open({
		      type: 2,
		      title: '<i class="iconfont '+icon+'"></i> '+title,
		      maxmin: true,
		      shadeClose: true, //点击遮罩关闭层
		      area : [width+'px' , height+'px'],
		      content: url
		});
	}	
}
$("a[data-toggle='popover']").popover({trigger:'click'});
</script>
</body>
</html>
 